function createElm(el, msg, className = 'error') {
  if (!el.nextSibling) {
    let tipDom = document.createElement('span')
    tipDom.innerHTML = msg
    tipDom.className = className
    el.parentNode.appendChild(tipDom)
  }
}
function removeElm(el) {
  el.nextSibling && el.nextSibling.remove()
}

class Validation {
  str(el, rules) {
    if (el.value.length > rules.max) {
      el.style.cssText="border:1px solid red"
      createElm(el, rules.msg, rules.className)
    } else {
      el.style.cssText="border:1px solid #ccc"
      removeElm(el)
    }
  }
}

export default new Validation()
